| Conditions | 1 |
| Paths | 1 |
| Total Lines | 109 |
| Lines | 0 |
| Ratio | 0 % |
| Changes | 2 | ||
| Bugs | 0 | Features | 0 |
Small methods make your code easier to understand, in particular if combined with a good name. Besides, if your method is small, finding a good name is usually much easier.
For example, if you find yourself adding comments to a method's body, this is usually a good sign to extract the commented part to a new method, and use the comment as a starting point when coming up with a good name for this new method.
Commonly applied refactorings include:
If many parameters/temporary variables are present:
| 1 | import { expect } from 'chai'; |
||
| 5 | describe('compiler.js', () => { |
||
| 6 | describe('Babel compiler and JSX', () => { |
||
| 7 | it('should compile and run ES6 features using Babel compiler', () => { |
||
| 8 | const source = compileES6(` |
||
| 9 | class Programmer { |
||
| 10 | setName(name) { this.name = name; } |
||
| 11 | getName() { return this.name } |
||
| 12 | greet() { return \`Hello, I'm \${this.name}\`; } |
||
| 13 | } |
||
| 14 | |||
| 15 | export default { extension: () => { |
||
| 16 | const hello = new Programmer(); |
||
| 17 | hello.setName('Marcelo'); |
||
| 18 | return hello.greet(); |
||
| 19 | } }; |
||
| 20 | `); |
||
| 21 | |||
| 22 | return runAndGetAlerts({ name: 'test-babel-compiler', source }, {}) |
||
| 23 | .then(result => { |
||
| 24 | expect(result).to.equals('Hello, I\'m Marcelo'); |
||
| 25 | }); |
||
| 26 | }); |
||
| 27 | |||
| 28 | it('should compile JSX syntax down to HTML', () => { |
||
| 29 | const source = compileES6(` |
||
| 30 | const annoy = <b>aborrecer</b>; |
||
| 31 | const style = { |
||
| 32 | color: 'red', |
||
| 33 | backgroundColor: 'blue' |
||
| 34 | }; |
||
| 35 | const component = ( |
||
| 36 | <div className="component" style={ style }> |
||
| 37 | Você fala demais, acabei de me { annoy } |
||
| 38 | <br hue="land" /> |
||
| 39 | </div> |
||
| 40 | ); |
||
| 41 | |||
| 42 | export default { extension: () => component }; |
||
| 43 | `); |
||
| 44 | |||
| 45 | return runAndGetAlerts({ name: 'test-jsx-compiler', source }, {}) |
||
| 46 | .then(result => { |
||
| 47 | expect(result).to.equals([ |
||
| 48 | '<div class="component" style="color:red;background-color:blue">', |
||
| 49 | 'Você fala demais, acabei de me ', |
||
| 50 | '<b>aborrecer</b><br hue="land" /></div>' |
||
| 51 | ].join('')); |
||
| 52 | }); |
||
| 53 | }); |
||
| 54 | |||
| 55 | it('shouldn\'t allow script and style tags', () => { |
||
| 56 | const source = compileES6(` |
||
| 57 | const annoy = <b>aborrecer</b>; |
||
| 58 | const style = { |
||
| 59 | color: 'red', |
||
| 60 | backgroundColor: 'blue' |
||
| 61 | }; |
||
| 62 | const component = ( |
||
| 63 | <div> |
||
| 64 | <script>alert();</script> |
||
| 65 | Alerting? |
||
| 66 | </div> |
||
| 67 | ); |
||
| 68 | |||
| 69 | export default { extension: () => component }; |
||
| 70 | `); |
||
| 71 | |||
| 72 | return runAndGetAlerts({ name: 'test-jsx-strip-tags', source }, {}) |
||
| 73 | .then(result => { |
||
| 74 | expect(result).to.equals('<div><span>alert();</span>Alerting?</div>'); |
||
| 75 | }); |
||
| 76 | }); |
||
| 77 | |||
| 78 | it('should correctly join array elements', () => { |
||
| 79 | const source = compileES6(` |
||
| 80 | const component = ( |
||
| 81 | <div> |
||
| 82 | { [1, 2, 3].map(num => <b>{ num }</b>) } |
||
| 83 | </div> |
||
| 84 | ); |
||
| 85 | |||
| 86 | export default { extension: () => component }; |
||
| 87 | `); |
||
| 88 | |||
| 89 | return runAndGetAlerts({ name: 'test-jsx-array', source }, {}) |
||
| 90 | .then(result => { |
||
| 91 | expect(result).to.equals('<div><b>1</b><b>2</b><b>3</b></div>'); |
||
| 92 | }); |
||
| 93 | }); |
||
| 94 | |||
| 95 | it('should differ self-closing tags', () => { |
||
| 96 | const source = compileES6(` |
||
| 97 | const component = ( |
||
| 98 | <div> |
||
| 99 | <div id="foo" /> |
||
| 100 | <br /> |
||
| 101 | </div> |
||
| 102 | ); |
||
| 103 | |||
| 104 | export default { extension: () => component }; |
||
| 105 | `); |
||
| 106 | |||
| 107 | return runAndGetAlerts({ name: 'test-jsx-array', source }, {}) |
||
| 108 | .then(result => { |
||
| 109 | expect(result).to.equals('<div><div id="foo"></div><br /></div>'); |
||
| 110 | }); |
||
| 111 | }); |
||
| 112 | }); |
||
| 113 | }); |
||
| 114 |